'use strict';
import React from 'react';
import {connect} from 'dva/index';
import {Button, Form, Table} from 'antd';
import styles from '../index.less';
import DirTree from '../../components/DirTree';
import FormBase from '../../components/Base/FormBase';
import notify from "../../components/NotificationExtra";
import ViewTitle from "../../components/ViewTitle";
import {ModalView, SearchForm} from "antd-extra";
import ModalCreateOrEditPersonnel from "./modal/ModalCreateOrEditPersonnel";
import ModalCreateOrEditPayroll from "./modal/ModalCreateOrEditPayroll";

import {exportExcel} from "../../utils/excelUtils";
const _ = require('lodash');

const table = 'personnel';

@Form.create()
@connect(({
            user,
            global, personnel,
            treeNode
          }) => ({...user, ...global, ...personnel, ...treeNode}))
export default class Tree extends FormBase {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {
    const {dispatch} = this.props;
    const {treeNode} = this.state;

    if (!treeNode) return;
    const {treeId} = treeNode;
    dispatch && dispatch({
      type: 'global/getModel',
      payload: {table: treeId, tenantCode: this.getTenantCode()}
    });
    const payload = this.props.form.getFieldsValue();
    _.map(payload, (value, key) => {
      if (value === '') {
        payload[key] = undefined;
      }
    });
    payload.table = treeId;
    dispatch && dispatch({
      type: 'personnel/findDicMany',
      payload
    });
  }

  async onDataLoad() {

  }

  onTreeNodeSelected = (node) => {
    if (!node) return;
    this.state.treeNode = node;
    this.componentDidMount();
  };
//todo
  onTreeDelete = (_id, result) => {

  };

  onCreateOrEdit = record => {
    const {treeNode} = this.state;
    if (!treeNode) return;
    const {treeId} = treeNode;
    const model = this.props[`${treeId}Model`];
    let modal = treeId === 'DicPerPayroll' ? ModalCreateOrEditPayroll : ModalCreateOrEditPersonnel;
    ModalView.open(modal, {title: '编辑表单', width: '1080px'}, {
      model, record,
      callback: payload => {
        payload.table = treeId;
        payload.treeId = treeId;
        this.props.dispatch({type: 'personnel/updateDic', payload}).then(res => {
          this.requestReturn(res);
          this.componentDidMount();
        });
      }
    });
  };
  onDelete = record => {
    const {code} = record;
    const {treeNode} = this.state;
    if (!treeNode) return;
    const {treeId} = treeNode;
    this.props.dispatch({type: 'personnel/deleteDic', payload: {table: treeId, code}}).then(res => {
      this.requestReturn(res);
      this.componentDidMount();
    });
  };

  dataPage = () => {
    const {treeNode, loading} = this.state;
    if (!treeNode) return <div></div>;
    const {personnelData = [], form} = this.props;
    const {treeId, name} = treeNode;
    const model = this.props[`${treeId}Model`];
    let modal = treeId === 'DicPerPayroll' ? ModalCreateOrEditPayroll : ModalCreateOrEditPersonnel;
    return <div>
      <ViewTitle title={name}
                 actions={[
                   <Button onClick={() => {
                     const {treeNode} = this.state;
                     if (!treeNode) return;
                     const {treeId} = treeNode;

                     const payload = this.props.form.getFieldsValue();
                     _.map(payload, (value, key) => {
                       if (value === '') {
                         payload[key] = undefined;
                       }
                     });
                     payload.table = treeId;
                     this.props.dispatch({
                       type: 'personnel/exportExcel',
                       payload
                     }).then(res => {
                       if (res) {
                         const {result = {}} = res;
                         const {header, data} = result;
                         exportExcel(header, data, '工资单');
                       }
                     });
                   }}>导出</Button>,
                   <Button
                     type="primary"
                     onClick={() => {
                       ModalView.open(modal, {title: '创建表单', width: '1080px'}, {
                         model,
                         callback: payload => {
                           payload.table = treeId;
                           payload.treeId = treeId;
                           this.props.dispatch({type: 'personnel/createDic', payload}).then(res => {
                             this.requestReturn(res);
                             this.componentDidMount();
                           });
                         }
                       });
                     }}>添加</Button>]}
      ></ViewTitle>
      <SearchForm
        style={{marginLeft: '6px', marginRight: '6px'}}
        onSearch={() => {
          this.state.current = 1;
          this.componentDidMount();
        }}
        onReset={this.handleReset}
        cols={3}
        min={6}
        expandText="展开"
        form={form}
      >
        {this.getDicSearchFields(model)}
      </SearchForm>
      <Table
        loading={loading}
        className={styles.antTable}
        bordered={true}
        columns={this.getDicTableCols(model, this.onCreateOrEdit, this.onDelete)}
        dataSource={personnelData}
        scroll={{x: true}}
        pagination={{
          current: this.state.current,
          total: this.state.total,
          showSizeChanger: true,
          onChange: page => {
            this.state.current = page;
            this.componentDidMount();
          },
          onShowSizeChange: (current, pageSize) => {
            this.state.current = 1;
            this.state.pageSize = pageSize;
            this.componentDidMount();
          }
        }}
        // pagination={{pageSize: 100}}
        //scroll={{ x: 1300 }}
      ></Table>
    </div>;
  };

  render() {
    const {dispatch, expandedKeys, personnelData = [], _notify} = this.props;

    if (_notify) {
      notify(_notify);
    }
    let title = '人事管理表单';
    const {treeNode = {}} = this.state;

    const {treeId = ''} = treeNode;
    const model = this.props[`${treeId}Model`];
    // const view = treeId === 'DicPerPayroll' ?
    //   <DataFacePayroll personnelData={personnelData}
    //                    treeId={treeId}
    //                    model={model}
    //                    callback={() => {
    //                      this.componentDidMount();
    //                    }}
    //
    //   ></DataFacePayroll> : this.dataPage();
    return (
      <Form className={styles.content}>
        <DirTree
          disableEdit={true}
          table={table}
          dispatch={dispatch}
          onTreeDelete={this.onTreeDelete}
          onTreeNodeSelected={this.onTreeNodeSelected}
          expandedKeys={expandedKeys}
          defaultExpandAll={true}
          title={title}
        > {this.dataPage()}</DirTree>
      </Form>
    );
  }
}
